<!DOCTYPE html>
<!--[if IE 9 ]><html class="ie9"><![endif]-->
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <title>WebHDFS Login</title>
    <link rel="ICON" href="img/icon.png">
    <!-- Vendor CSS -->
    <link href="vendors/bower_components/animate.css/animate.min.css" rel="stylesheet">
    <link href="vendors/bower_components/material-design-iconic-font/dist/css/material-design-iconic-font.min.css" rel="stylesheet">

    <!-- CSS -->
    <link href="css/app.min.1.css" rel="stylesheet">
    <link href="css/app.min.2.css" rel="stylesheet">
</head>

<body class="login-content">
<!-- Login -->
<!-- Login -->
<form th:action="@{/adminLogin}" class="lc-block toggled" id="l-login" method="post" autocomplete="off">
    <div>
        <h3 class="text-left m-0 p-b-30" style="font-family:'幼圆'">用户登录<br><small><strong>(未注册用户请点下方红色按钮进行注册)</strong></small></h3>
    </div>
    <div class="input-group m-b-20">
        <span class="input-group-addon"><i class="zmdi zmdi-account"></i></span>
        <div class="fg-line">
            <input type="text" title="用户名" class="form-control" placeholder="请输入用户名..." name="username" autocomplete="false" onfocus='$("#LoginError_message").hide();' value="">
        </div>
    </div>

    <div class="input-group m-b-20">
        <span class="input-group-addon"><i class="zmdi zmdi-key"></i></span>
        <div class="fg-line">
            <input type="password" title="密码" class="form-control" placeholder="请输入密码..." name="password" autocomplete="false" onfocus='$("#LoginError_message").hide();'>
        </div>
    </div>

    <div class="clearfix"></div>

    <button type="submit" title="登录" class="btn btn-login btn-danger btn-float"><i class="zmdi zmdi-arrow-forward"></i></button>

    <ul class="login-navigation">
        <li class="bgm-red">用户注册页面</li>
    </ul>
    <span id="LoginError_message" class="help-block" style="color: red" th:if="${param.error}">用户名或密码错误</span>
</form>



<!-- Older IE warning message -->
<!--[if lt IE 9]>
<div class="ie-warning">
    <h1 class="c-white">Warning!!</h1>
    <p>You are using an outdated version of Internet Explorer, please upgrade <br/>to any of the following web browsers to access this website.</p>
    <div class="iew-container">
        <ul class="iew-download">
            <li>
                <a href="http://www.google.com/chrome/">
                    <img src="img/browsers/chrome.png" alt="">
                    <div>Chrome</div>
                </a>
            </li>
            <li>
                <a href="https://www.mozilla.org/en-US/firefox/new/">
                    <img src="img/browsers/firefox.png" alt="">
                    <div>Firefox</div>
                </a>
            </li>
            <li>
                <a href="http://www.opera.com">
                    <img src="img/browsers/opera.png" alt="">
                    <div>Opera</div>
                </a>
            </li>
            <li>
                <a href="https://www.apple.com/safari/">
                    <img src="img/browsers/safari.png" alt="">
                    <div>Safari</div>
                </a>
            </li>
            <li>
                <a href="http://windows.microsoft.com/en-us/internet-explorer/download-ie">
                    <img src="img/browsers/ie.png" alt="">
                    <div>IE (New)</div>
                </a>
            </li>
        </ul>
    </div>
    <p>Sorry for the inconvenience!</p>
</div>
<![endif]-->

<!-- Javascript Libraries -->
<script src="vendors/bower_components/jquery/dist/jquery.min.js"></script>
<script src="vendors/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>

<script src="vendors/bower_components/Waves/dist/waves.min.js"></script>

<!-- Placeholder for IE9 -->
<!--[if IE 9 ]>
<script src="vendors/bower_components/jquery-placeholder/jquery.placeholder.min.js"></script>
<![endif]-->

<script>
    $(function(){
        /*
         * Login
         */
        if ($('.login-content')[0]) {
            //Add class to HTML. This is used to center align the logn box
            $('html').addClass('login-content');

            $('body').on('click', '.login-navigation > li', function(){
                var z = $(this).data('block');
                var t = $(this).closest('.lc-block');

                t.removeClass('toggled');
                window.location.href="./userRegister";

                setTimeout(function(){
                    $(z).addClass('toggled');
                });
            })
        }
    });

</script>

</body>
</html>